<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
	<title>Swing FlowLayout</title>
	<link href="../../../book.css" rel="stylesheet" type="text/css">
</head>

<body>
<h1>Swing FlowLayout</h1>
<table border="0" width="800" cellspacing="0" cellpadding="0">
	<tr>
		<td>A <b>FlowLayout</b> arranges components in a directional flow, much 
		like lines of text in a paragraph. <b>FlowLayouts</b> are typically used 
		to arrange buttons in a panel. It arranges buttons horizontally until no 
		more buttons fit on the same line. The line alignment is determined by 
		the align property.<ul>
		<li><a href="#MainFeatures">Main Features</a></li>
		<li><a href="#GraphicalFeedback">Graphical Feedback</a></li>
	</ul>
    <p></p>
<h2><a name="MainFeatures"></a>Main Features</h2>
            <ul>
              <li>Select <b>FlowLayout</b> from the <b>Layouts</b> palette and 
				drop it on a JFrame or JPanel</li>
            </ul>
<blockquote>
	<p>
	<img border="0" src="images/fl_design_view.gif"></p>
</blockquote>
<ul>
				<li>Graphical feedback is provided for all drop and move 
				interactions</li>
            </ul>
<blockquote>
	<p>
	<img border="0" src="images/fl_drop1.gif" width="320" height="220">&nbsp;
				<img border="0" src="images/fl_move1.gif"></p>
</blockquote>
<ul>
				<li>Horizontal and vertical gaps can be specified using the <b>
				<a href="../../../com.instantiations.designer.doc.user/html/userinterface/property_pane.html">Property Pane</a></b></li>
            </ul>
<blockquote>
	<p><img border="0" src="images/fl_properties1.gif" align="top">&nbsp;
	<img border="0" src="images/fl_gaps.gif"></p>
</blockquote>
<ul>
				<li>Horizontal alignment can be specified using the <b>
				<a href="../../../com.instantiations.designer.doc.user/html/userinterface/property_pane.html">Property Pane</a></b></li>
            </ul>
<blockquote>
	<p>
	<img border="0" src="images/fl_properties2.gif" align="top" width="212" height="188">&nbsp;
	<img border="0" src="images/fl_align_right.gif" width="320" height="227"></p>
</blockquote>
          <p></p>
            <h2><a name="GraphicalFeedback"></a>Graphical Feedback</h2>
            <ul>
              <li>When moving a widget or adding a new widget, the current drop 
				point is highlighted in red<br>
				<br>
	<img border="0" src="images/fl_drop1.gif" width="320" height="220">&nbsp;
	<img border="0" src="images/fl_drop2.gif" width="320" height="220"><br>
				<img border="0" src="images/fl_move1.gif">&nbsp;
				<img border="0" src="images/fl_move2.gif" width="320" height="220"></li>
            </ul>
		</td>
	</tr>
</table>
</body>
</html>